<template>
	<view class="content">
		<view class="uni-margin-wrap">
			<swiper class="swiper" circular :indicator-dots="true" autoplay :interval="3000" :duration="500">
				<swiper-item>
					<navigator url="/pages/demo/demo" animation-type="pop-in" animation-duration="300">
						<image class="uni-bg" src="../../static/home/1.gif" mode="scaleToFill"></image>
					</navigator>
				</swiper-item>
				<swiper-item>
					<navigator url="/pages/demo/demo" animation-type="pop-in" animation-duration="300">
						<image class="uni-bg" src="../../static/home/2.jpg" mode="scaleToFill"></image>
					</navigator>
				</swiper-item>
				<swiper-item>
					<navigator url="/pages/demo/demo" animation-type="pop-in" animation-duration="300">
						<image class="uni-bg" src="../../static/home/3.jpg" mode="scaleToFill"></image>
					</navigator>
				</swiper-item>
			</swiper>
		</view>

		<!-- 公告 -->
		<Notice />

		<Nav />

		<scroll-view scroll-y="true" class="main-scroll-Y">
			<ImportantContent />
			<HotContent />
		</scroll-view>


		<!-- <navigator url="/pages/demo/demo" animation-type="pop-in" animation-duration="300">
			<button type="default">跳转到demo页面</button>
		</navigator>

		<button @click="handleSetStorage">setStorage</button> -->
	</view>
</template>

<script setup>
	import {
		onMounted
	} from 'vue';
	import Notice from './notice.vue';
	import Nav from './nav.vue';
	import ImportantContent from './importantContent.vue'
	import HotContent from './hotContent.vue'

	const handleSetStorage = () => {
		uni.setStorage({
			key: 's_name',
			data: 'hello',
			success: function() {
				console.log('success');
			}
		});
	}

	onMounted(() => {

	})
</script>

<style>
	.content {
		background-color: #ececec;
		height: 100vh;
		/* #ifdef H5 */
		height: calc(100vh - 50px);
		/* #endif */

		/* #ifdef MP-WEIXIN */
		height: 100vh;
		/* #endif */

		overflow: hidden;
	}


	.uni-margin-wrap {
		width: 690rpx;
		width: 100%;
	}

	.swiper {
		height: 150px;
	}

	.uni-bg {
		height: 160px;
		width: 100%;
	}

	.uni-bg-red {
		background: url('../../static/home/1.gif') no-repeat;
		background-size: 100% 100%;
	}

	.uni-bg-green {
		background: url('../../static/home/2.jpg') no-repeat;
		background-size: 100% 100%;
	}

	.uni-bg-blue {
		background: url('../../static/home/3.jpg') no-repeat;
		background-size: 100% 100%;
	}

	.swiper-list {
		margin-top: 40rpx;
		margin-bottom: 0;
	}

	.uni-common-mt {
		margin-top: 60rpx;
		position: relative;
	}

	.info {
		position: absolute;
		right: 20rpx;
	}

	.uni-padding-wrap {
		width: 550rpx;
		padding: 0 100rpx;
	}
</style>


<style lang="scss" scoped>
	.main-scroll-Y {
		height: calc(100vh - 150px - 31px - 152px);
		/* #ifdef H5 */
		height: calc(100vh - 150px - 31px - 152px - 50px);
		/* #endif */

		/* #ifdef MP-WEIXIN */
		height: calc(100vh - 150px - 31px - 152px);
		/* #endif */

	}
</style>